﻿<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link href="../../plugins/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
    <link href="../../plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
    <link href="../../plugins/Ionicons/css/ionicons.min.css" rel="stylesheet" />
    <link href="../../plugins/bootstrap-fileinput/css/fileinput.min.css" rel="stylesheet" />
    <link href="../../plugins/bootstrap-fileinput/themes/explorer-fa/theme.min.css" rel="stylesheet" />
    <link href="../../plugins/adminLTE/dist/css/AdminLTE.min.css" rel="stylesheet" />
    <link href="../../plugins/adminLTE/dist/css/skins/all-skins.min.css" rel="stylesheet" />
</head>
<body class="hold-transition skin-blue sidebar-mini" style="background-color: #ecf0f5">
    <section class="content container-fluid">
        <div class="box box-default">
            <div class="box-header with-border">
                <h3 class="box-title"><i class="fa fa-upload"></i>图片上传</h3>
            </div>
            <div class="box-body">
                <form enctype="multipart/form-data">
                    <div class="form-group">
                        <label>文件上传(多选)</label>
                        <div class="file-loading">
                            <input id="file-0c" class="file" type="file" multiple data-min-file-count="3">
                        </div>
                    </div>
                    <div class="form-group">
                        <label>文件上传(单选)</label>
                        <div class="file-loading">
                            <input id="file-0d" class="file" type="file">
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="box box-default">
            <div class="box-header with-border">
                <h3 class="box-title"><i class="fa fa-upload"></i>拖拽上传</h3>
            </div>
            <div class="box-body">
                <div class="form-group">
                    <div class="file-loading">
                        <input id="file-1" type="file" multiple class="file" data-overwrite-initial="false" data-min-file-count="2">
                    </div>
                </div>
            </div>
        </div>
    </section>
    <script src="../../plugins/jquery/dist/jquery.min.js"></script>
    <script src="../../plugins/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="../../plugins/adminLTE/dist/js/adminlte.min.js"></script>
    <script src="../../plugins/bootstrap-fileinput/js/fileinput.min.js"></script>
    <script src="../../plugins/bootstrap-fileinput/js/locales/fr.js"></script>
    <script src="../../plugins/bootstrap-fileinput/js/locales/es.js"></script>
    <script src="../../plugins/bootstrap-fileinput/themes/explorer-fa/theme.min.js"></script>
    <script>
        $("#file-1").fileinput({
            theme: 'fa',
            uploadUrl: '#', // you must set a valid URL here else you will get an error
            allowedFileExtensions: ['jpg', 'png', 'gif'],
            overwriteInitial: false,
            maxFileSize: 1000,
            maxFilesNum: 10,
            //allowedFileTypes: ['image', 'video', 'flash'],
            slugCallback: function (filename) {
                return filename.replace('(', '_').replace(']', '_');
            }
        });
    </script>
</body>
</html>
